<div id="project-input-form">

	<lift:head>
		<script class="lift:Includes.overlay"></script>
		<link class="lift:Includes.ProjectInputForm"></link>
	</lift:head>

	<ul class="form-tabs-list">
		<li class="form-tab active"><a data-toggle="tab" href="#new-analysis-form">New Project</a></li>
		<li class="form-tab"><a data-toggle="tab" href="#new-import-form">Import Project</a></li>
	</ul>

	<!-- NEW ANALYSIS UPLOAD -->
	<div id="new-analysis-form" class="active">
		<!-- NAME -->
		<div class="form-field clearfix">
			<div class="input-label">Project Name</div>

			<div class="input-area">
				<input type="text" name="name-input"></input>
				<div class="input-help">
					<i class="fa fa-comment"></i>
					This is the name of the project you are about to create. You can name it anything you like,
					and you can rename it later if you want to. Try to avoid naming multiple projects the same
					thing.
				</div>
			</div>
			<div class="feedback-area" name="name-feedback">
				<!-- name feedback e.g.
					<div class="feedback error">No blank names</div>
					<div class="feedback warning">Name conflict oh noes!</div>
				-->
			</div>
		</div>

		<!-- FILE -->
		<div class="form-field clearfix">
			<div class="input-label">File</div>
			
			<div class="input-area">

				<div class="file-input-area clearfix">

					<div class="file-input-button btn btn-flat btn-secondary">
						<input type="file" name="file-input"></input>
						<div class="prompt">
							<i class="fa fa-folder-open-o"></i>
							Browse for a file							
						</div>
					</div>

					<div class="file-or-msg">OR</div>

					<div class="file-dropzone">
						<div class="dropzone-msg">
							<!-- see ProjectInputForm.css for content -->
						</div>
					</div>
				</div>

				<div class="file-input-result">
					The new project will be created from
					<div class="button-bar">
						<div class="file-input-name item" name="file-input-choice-label">
							the file you choose or drag
						</div>
						<div class="file-input-clear button item" title="Don't use this file">
							<i class="fa fa-times-circle"></i>
						</div>
					</div>
				</div>

				<div class="input-help">
					<i class="fa fa-comment"></i>
					This is the file that will be analyzed for tracing. For Java projects, upload either a
					<span class="filetype">.jar</span>, <span class="filetype">.war</span>, or <span class="filetype">.ear</span> file, or
					upload a <span class="filetype">.zip</span> file containing <span class="filetype">.class</span>
					files. For .NET projects, upload a <span class="filetype">.zip</span> file containing one or more
					.NET assemblies (<span class="filetype">.dll</span> or <span class="filetype">.exe</span> files)
					and related symbols (<span class="filetype">.pdb</span> files).
				</div>
				<div class="input-help">
					<i class="fa fa-comment"></i>
					To see code coverage at the source code level, include Java or .NET source code with your upload. For .NET projects,
					copy the root folder from your source tree to the root folder of the <span class="filetype">.zip</span> file you upload.
				</div>
			</div>
			<div class="feedback-area" name="file-feedback">
				<!-- file feedback, e.g.
					<div class="feedback">That file is lame, try a different one!</div>
				-->
			</div>
		</div>

		<!-- OK/CANCEL -->
		<div class="form-field clearfix align-right">
			<div class="input-area">
				<div class="btn btn-flat btn-secondary" name="cancel-button">Clear</div>
				<div class="btn btn-flat btn-primary" name="submit-button">OK</div>
			</div>
		</div>

	</div>
	<!-- END OF ANALYSIS FORM -->

	<!-- PROJECT IMPORT FORM -->
	<div id="new-import-form">

		<!-- FILE -->
		<div class="form-field clearfix">
			<div class="input-label">File</div>

			<div class="input-area">

				<div class="file-input-area clearfix">

					<div class="file-input-button btn btn-flat btn-secondary">
						<input type="file" name="file-input"></input>
						<div class="prompt">
							<i class="fa fa-folder-open-o"></i>
							Browse for a file
						</div>
					</div>

					<div class="file-or-msg">OR</div>

					<div class="file-dropzone">
						<div class="dropzone-msg">
							<!-- see ProjectInputForm.css for content -->
						</div>
					</div>
				</div>

				<div class="file-input-result">
					The project will be imported from
					<div class="button-bar">
						<div class="file-input-name item" name="file-input-choice-label">
							the file you choose or drag
						</div>
						<div class="file-input-clear button item" title="Don't use this file">
							<i class="fa fa-times-circle"></i>
						</div>
					</div>
				</div>

				<div class="input-help">
					<i class="fa fa-comment"></i>
					This is the file that will be imported. Projects are exported as
					<span class="filetype">.pulse</span> files.
				</div>
			</div>
			<div class="feedback-area" name="file-feedback">
				<!-- file feedback, e.g.
					<div class="feedback">That file is lame, try a different one!</div>
				-->
			</div>
		</div>

		<!-- OK/CANCEL -->
		<div class="form-field clearfix align-right">
			<div class="input-area">
				<div class="btn btn-flat btn-secondary" name="cancel-button">Clear</div>
				<div class="btn btn-flat btn-primary" name="submit-button">OK</div>
			</div>
		</div>

	</div>
	<!-- END PROJECT IMPORT FORM -->

</div>